<!-- 余热利用系统 -->
<template>
  <div class="content">
    <!-- 0: 暂停  1: 运行  2: 故障 -->
    <div :class="status[ind]"></div>
  </div>
</template>

<script>
  export default {
    data() {
      return {
        ind: 1,
        status: ['stop', 'run', 'bad'],
        timer: null
      }
    },
    created() {
    },
    mounted() {
      const timer = setInterval(() => {
      }, 5000);
      this.$once('hook:beforeDestroy', () => clearInterval(timer))
    },
    methods: {
      async suiji() {
        this.ind = res.data.projects.number
      }
    }
  }

</script>

<style lang="scss" scoped>
  .content {
    width: 100%;
    height: calc(100vh - 120px);

    .stop {
      width: 100%;
      height: 100%;
      background-repeat: no-repeat;
      background-image: url('../assets/images/hot-0.png');
      background-size: contain;
      background-position: center;
    }

    .run {
      width: 100%;
      height: 100%;
      background-repeat: no-repeat;
      background-image: url('../assets/images/hot-2.png');
      background-size: contain;
      background-position: center;
    }

    .bad {
      width: 100%;
      height: 100%;
      background-repeat: no-repeat;
      background-image: url('../assets/images/hot-1.png');
      background-size: contain;
      background-position: center;
    }
  }

</style>
